<html>
<head>
  <title>Evernote Export</title>
  <basefont face="微软雅黑" size="2" />
  <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
  <meta name="exporter-version" content="YXBJ Windows/603139 (zh-CN, DDL); Windows/10.0.0 (Win64); EDAMVersion=V2;"/>
  <style>
    body, td {
      font-family: 微软雅黑;
      font-size: 10pt;
    }
  </style>
</head>
<body>
<a name="1084"/>

<div>
<span><div><div><div><span style="font-size: 14.6667px;"><span style="font-size: 14.6667px; font-weight: bold;">URL和URI的区别：</span></span></div><ol><li><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif, SimHei, SimSun; font-variant-caps: normal; font-variant-ligatures: normal;">URL是一种具体的URI，它是URI的一个子集</span></div></li></ol><ol start="2"><li><div> <span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif, SimHei, SimSun; font-variant-caps: normal; font-variant-ligatures: normal;">URI和URL都定义了资源是什么</span></div></li><li><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif, SimHei, SimSun; font-variant-caps: normal; font-variant-ligatures: normal;">URL</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif, SimHei, SimSun; font-variant-caps: normal; font-variant-ligatures: normal;">不仅唯一标识资源，而且还提供了定位该资源的信息。</span></div></li><li><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif, SimHei, SimSun; font-variant-caps: normal; font-variant-ligatures: normal;">URI 是一种语义上的抽象概念，可以是绝对的，也可以是相对的，而URL则必须提供足够的信息来定位，是绝对的</span></div></li></ol><div><font style="font-size: 11pt;"><br/></font></div><div><font style="font-size: 11pt;"><br/></font></div><div><font style="font-size: 11pt;"><br/></font></div><div><span style="font-size: 14.6667px;"><span style="font-size: 14.6667px; font-weight: bold;">href和src的区别：</span></span></div><ol><li><div><span style="font-size: 14.6667px;">href是引用，表示当前页面和它相关联</span></div></li><li><div><span style="font-size: 11pt;">src是引入，是页面的一部分</span></div></li></ol><div><span style="font-size: 11pt;"><br/></span></div><div><span style="font-size: 11pt;"><br/></span></div><div><span style="font-size: 14.6667px;"><span style="font-size: 14.6667px; font-weight: bold;">rollup和webpack区别：</span></span></div><div><span style="font-size: 14.6667px;">webpack更适合打包组件库，应用程序之类的应用grollup更适合打包纯js的类库</span></div><div><span style="font-size: 14.6667px;"><br/></span></div><div><span style="font-size: 14.6667px;">webpack拆分代码，按需加载</span></div><div><span style="font-size: 14.6667px;">rollup所有资源放在一个地方，一次性加载，利用tree-shake的特性来剔除项目中未使用的代码，减少冗余，但是webpack2也在逐渐支持tree-shake</span></div><div><br/></div><div><br/></div><div><br/></div><div><span style="font-size: 14.6667px;"><span style="font-size: 14.6667px; font-weight: bold;">常见的状态码：</span></span></div><ol><li><div><span style="font-size: 14.6667px;">1xx：需要继续操作</span></div></li></ol><ul><li><div><span style="font-size: 11pt;">100：客户端继续请求</span></div></li><li><div><span style="font-size: 11pt;">101：服务端根据客户端请求切换协议</span></div></li></ul><ol start="2"><li><div><span style="font-size: 11pt;">2xx：成功</span></div></li></ol><ul><li><div><span style="font-size: 11pt;">200：请求成功</span></div></li><li><div><span style="font-size: 11pt;">201：请求成功并创建了新的资源</span></div></li><li><div><span style="font-size: 11pt;">202：接收请求，但未处理完成</span></div></li><li><div><span style="font-size: 11pt;">204：服务器成功处理，但没有返回内容，在未更新网页的情况下，确保浏览器继续显示当前文档</span></div></li></ul><ol start="3"><li><div><span style="font-size: 11pt;">3xx：重定向</span></div></li></ol><ul><li><div><span style="font-size: 11pt;">300：用户终端选择（资源特征与资源的列表）</span></div></li><li><div><span style="font-size: 11pt;">301：永久移动</span></div></li><li><div><span style="font-size: 11pt;">302：临时移动</span></div></li><li><div><span style="font-size: 11pt;">303：查看其他地址</span></div></li></ul><ol start="4"><li><div><span style="font-size: 11pt;">4xx：客户端错误</span></div></li></ol><ul><li><div><span style="font-size: 11pt;">400：语法错误，服务器无法理解</span></div></li><li><div><span style="font-size: 11pt;">403：请求不允许</span></div></li><li><div><span style="font-size: 11pt;">404：请求资源找不到</span></div></li></ul><ol start="5"><li><div><span style="font-size: 11pt;">5xx：服务端错误</span></div></li></ol><ul><li><div><span style="font-size: 11pt;">500：服务器内部错误</span></div></li><li><div><span style="font-size: 11pt;">501：服务器不支持请求功能</span></div></li></ul><div><span style="font-size: 11pt;"><br/></span></div><div><font style="font-size: 11pt;"><br/></font></div><div><font style="font-size: 11pt;"><br/></font></div><div><span style="font-size: 14.6667px;"><span style="font-size: 14.6667px; font-weight: bold;">深拷贝实现的方式：</span></span></div><div><span style="font-size: 14.6667px;">浅拷贝只复制指向对象的指针，而不复制对象本身，新旧对象使用的是同一块内存</span></div><div><span style="font-size: 14.6667px;">深拷贝创建了另外一个一模一样的对象</span></div><div><span style="font-size: 14.6667px;"><br/></span></div><div><span style="font-size: 14.6667px;">浅拷贝：</span></div><div><span style="font-size: medium; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(18, 18, 18); font-family: -apple-system, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Source Han Sans SC&quot;, &quot;Noto Sans CJK SC&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">var a = [1,2,3,4];</span></div><div><span style="font-size: medium; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(18, 18, 18); font-family: -apple-system, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Source Han Sans SC&quot;, &quot;Noto Sans CJK SC&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">var b = a;</span></div><div><span style="font-size: 11pt;"><br/></span></div><div><span style="font-size: 14.6667px;">深拷贝：不可能拷贝原型</span></div><div><img src="面试_files/c4cbd9d34b866c4f3e57358629c23c7.jpg" type="image/jpeg" data-filename="c4cbd9d34b866c4f3e57358629c23c7.jpg"/></div><div><font style="font-size: 11pt;"><br/></font></div><div><font style="font-size: 11pt;"><br/></font></div><div><font style="font-size: 11pt;"><br/></font></div><div><font style="font-size: 11pt;"><br/></font></div><div><span style="font-size: 14.6667px;"><span style="font-size: 14.6667px; font-weight: bold;">跨域怎么解决：</span></span></div><div>同源：如果两个URL的协议、端口、域名完全一致，那么这两个URL就是同源的</div><div>跨域：两个URL不同源，但是一个URL可以访问另一个URL中的数据</div><div><br/></div><div><span style="font-size: 14.6667px;">方法一：CORS</span></div><div><span style="font-size: 15px; white-space: pre; font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">response</span><span style="font-size: 15px; white-space: pre; font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.setHeader</span><span style="font-size: 15px; white-space: pre; font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; white-space: pre; font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">&quot;</span><span style="font-size: 15px; white-space: pre; font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Access-Control-Allow-Origin</span><span style="font-size: 15px; white-space: pre; font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">&quot;</span><span style="font-size: 15px; white-space: pre; font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; white-space: pre; font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">&quot;</span><a href="http://localhost:9990/" style="font-size: 15px; white-space: pre; color: rgb(0, 0, 0); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">http://localhost:9990</a><span style="font-size: 15px; white-space: pre; font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">&quot;</span><span style="font-size: 15px; white-space: pre; font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">);</span></div><div><span style="font-size: 14.6667px;">方法二：JSONP</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">给不支持CORS跨域的浏览器使用，比如说IE。给它专门建一个js文件，我们通过构造src形如</span><span style="box-sizing: border-box; font-size: 13.6px; background-color: rgba(27, 31, 35, 0.05); border-radius: 3px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><a href="http://xxx.com/friends.json?callback=xxxx" style="background-color: rgba(27, 31, 35, 0.05); font-size: 13.6px; font-family: SFMono-Regular, Consolas, &quot;Liberation Mono&quot;, Menlo, Courier, monospace; font-variant-caps: normal; font-variant-ligatures: normal;">xxx.com/friends.json?callback=xxxx</a></span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">的&lt;script&gt;标签请求这个JS文件，会执行一个回调，回调里面就是想要的数据。</span></div><ul><li><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">优点就是兼容IE，可以跨域；</span></div></li><li><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">缺点是由于是script标签，所以它读不到AJAX那么精确的状态，不知道状态码，响应头，只知道成功或者失败，只能发GET请求。</span></div></li></ul><div><br/></div><div><span style="font-size: 12pt;"><br/></span></div><div><span style="font-size: 12pt;"><br/></span></div><div><font style="font-size: 11pt;"><br/></font></div><div><span style="font-size: 14.6667px;"><span style="font-size: 14.6667px; font-weight: bold;">webpack中的loader和plugin的作用是什么</span></span></div><div style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; margin: 8px 0px 0px 32px; padding: 0px; list-style: disc; overflow-wrap: break-word;"><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: Verdana, Arial, Helvetica, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">webpack是一个模块打包器，</span> <span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: Verdana, Arial, Helvetica, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">根据每个模块文件之间的依赖关系将所有的模块打包（bundle）起来</span></div><div style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; margin: 8px 0px 0px 32px; padding: 0px; list-style: disc; overflow-wrap: break-word;"><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; overflow-wrap: break-word;"><span style="font-size: 11pt;">loader就是加载器（用来load一个文件）</span></span></div><div style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; margin: 8px 0px 0px 32px; padding: 0px; list-style: disc; overflow-wrap: break-word;"><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; overflow-wrap: break-word;"><span style="font-size: 11pt;">plugin就是一个插件（就是用来加强功能的）</span></span></div><div style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; margin: 8px 0px 0px 32px; padding: 0px; list-style: disc; overflow-wrap: break-word;"><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; overflow-wrap: break-word;"><span style="font-size: 11pt;">loader一般情况下是一对一</span></span></div><div style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; margin: 8px 0px 0px 32px; padding: 0px; list-style: disc; overflow-wrap: break-word;"><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; overflow-wrap: break-word;"><span style="font-size: 11pt;">plugin一般是多对一，也有一对多的，但是比较少见</span></span></div><ol start="2"><li><div><span style="font-size: 11pt;">给webpack一个js文件，它通过一个内置的</span><span style="font-size: 11pt; color: rgb(255, 70, 53);">babel-loader</span><span style="font-size: 11pt;">的东西将这个js文件放到webpack中，然后webpack就会输出一个另外的js文件</span></div></li><li><div><span style="font-size: 11pt;">同样也会引入一个css，它通过</span><span style="font-size: 11pt; color: rgb(235, 0, 115);">style-loader</span><span style="font-size: 11pt;">和</span><span style="font-size: 11pt; color: rgb(235, 0, 115);">css-loader</span><span style="font-size: 11pt;">两个loader将css文件变成一个style标签（这个标签也是JS生成的，所以在某种程度上来讲它也是一个JS），还有一种情况，它可以通过一个插件</span><span style="font-size: 11pt; color: rgb(235, 0, 115);">MIniCssExtractPlugin</span><span style="font-size: 11pt;">将n个CSS文件变成一个CSS文件</span></div></li><li><div><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; overflow-wrap: break-word;"><span style="font-size: 11pt;">HTML是0个或者一个HTML文件通过</span><span style="font-size: 11pt; color: rgb(235, 0, 115);">HtmlWebpackPlugin</span><span style="font-size: 11pt;">这个插件来生成一个新的Html文件，这个HTML文件和 之前的区别就是它自动引入了上面的css和js</span></span></div></li></ol><div><span style="font-size: 11pt;"><br/></span></div><div><font style="font-size: 12pt;"><span style="font-size: 12pt; font-weight: bold;">函数防抖和函数节流：</span></font></div><div><span style="font-size: 14.6667px;">函数防抖：</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">简单点来说就是</span><span style="box-sizing: border-box; outline: 0px; overflow-wrap: break-word; font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; font-weight: bold;">带着一起做</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">，一段时间内会等，然后带着一起做</span></div><div><span style="font-size: 12pt; color: rgb(77, 77, 77);">function debounce(fn,delay){</span></div><div><span style="font-size: 12pt; color: rgb(77, 77, 77);">    let timerId = null</span></div><div><span style="font-size: 12pt; color: rgb(77, 77, 77);">    return function(){</span></div><div><span style="font-size: 12pt; color: rgb(77, 77, 77);">        if(timerId){window.clearTimeout(timerId)}</span></div><div><span style="font-size: 12pt; color: rgb(77, 77, 77);">        timerId = setTimeout(()=&gt;{</span></div><div><span style="font-size: 12pt; color: rgb(77, 77, 77);">            fn.apply(this,arguments)</span></div><div><span style="font-size: 12pt; color: rgb(77, 77, 77);">            timerId = null</span></div><div><span style="font-size: 12pt; color: rgb(77, 77, 77);">        },delay)</span></div><div><span style="font-size: 12pt; color: rgb(77, 77, 77);">    }</span></div><div><span style="font-size: 12pt; color: rgb(77, 77, 77);">}</span></div><div><span style="font-size: 12pt;"><br/></span></div><div><span style="font-size: 16px; color: rgb(77, 77, 77);">函数节流：</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">就是一段时间执行完一次之后，就不会执行第二次</span></div><div><span style="font-size: 11pt;">function throttle(fn,delay){</span></div><div><span style="font-size: 11pt;">    let canUse = true</span></div><div><span style="font-size: 11pt;">    return function(){</span></div><div><span style="font-size: 11pt;">        if(canUse){</span></div><div><span style="font-size: 11pt;">            fn.apply(this,arguments)</span></div><div><span style="font-size: 11pt;">            canUse = false</span></div><div><span style="font-size: 11pt;">            setTimeout(()=&gt;{</span></div><div><span style="font-size: 11pt;">                canUse = true</span></div><div><span style="font-size: 11pt;">            },delay)</span></div><div><span style="font-size: 11pt;">        }</span></div><div><span style="font-size: 11pt;">    }</span></div><div><span style="font-size: 11pt;">}</span></div><div><span style="font-size: 11pt;"><br/></span></div><div><span style="font-size: 11pt;"><br/></span></div><div><font style="font-size: 12pt;"><span style="font-size: 12pt; font-weight: bold;">原型链和继承：</span></font></div></div><div><span style="font-size: 12pt;">当访问一个对象的某个属性时，会先在这个对象本身属性上查找，如果没有找到，则会去它的__proto__隐式原型上查找，即它的构造函数的prototype，如果还没有找到就会再在构造函数的prototype的__proto__中查找，这样一层一层向上查找就会形成一个链式结构，我们称为原型链。</span></div><div><span style="font-size: 12pt;"><br/></span></div><div><span style="font-size: 16px;">对象.__proto__===其构造函数的.prototype</span></div><div><span style="font-size: 16px;">Object.prototype是所有对象的（直接或间接）的原型</span></div><div><span style="font-size: 16px;">所有函数都是有Fuction构造的</span></div><div><span style="font-size: 16px;"><br/></span></div><div><span style="font-size: 16px;"><br/></span></div><div><span style="font-size: 12pt;"><br/></span></div><ol><li><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(238, 238, 238); color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">基于原型的继承：</span></div></li></ol><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">function</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Parent</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name1</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name1</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">parent</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.prototype.</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">pMethod</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">()</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=&gt;</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">console</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.log</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><br/></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">function</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Child</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name2</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Parent</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.call</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name2</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name2</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Child</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.prototype.__proto__ = </span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Parent</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.prototype</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Child</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.prototype.</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">cMethod</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">()</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=&gt;</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">console</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.log</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name2</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(246, 248, 250); font-size: 13.6px; letter-spacing: normal; orphans: 2; widows: 2; word-spacing: 0px;"><span style="background-color: rgb(38, 50, 56); font-size: 15px;"><span style="font-size: 15px; background-color: rgb(38, 50, 56); color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></span></div><div style="background-color: rgb(246, 248, 250); font-size: 13.6px; letter-spacing: normal; orphans: 2; widows: 2; word-spacing: 0px;"><span style="background-color: rgb(38, 50, 56); font-size: 15px;"><span style="font-size: 15px; background-color: rgb(38, 50, 56);"><br/></span></span></div><div style="background-color: rgb(246, 248, 250); font-size: 13.6px; letter-spacing: normal; orphans: 2; widows: 2; word-spacing: 0px;"><span style="background-color: rgb(38, 50, 56); font-size: 15px;"><span style="font-size: 15px; background-color: rgb(38, 50, 56);"><br/></span></span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(238, 238, 238); color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">2. 基于class的继承：</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">class</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Parent</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">constructor</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name1</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name1</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name1</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">pMethod</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">()</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">console</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.log</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name1</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">class</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Child</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">extends</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(195, 232, 141); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Parent</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">constructor</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name2</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name1</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">super</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name1</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name2</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name2</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">cMethod</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">()</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">console</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.log</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name2</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(246, 248, 250); font-size: 13.6px; letter-spacing: normal; orphans: 2; widows: 2; word-spacing: 0px;"><span style="background-color: rgb(38, 50, 56); font-size: 15px;"><span style="font-size: 15px; background-color: rgb(38, 50, 56); color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></span></div><div style="background-color: rgb(246, 248, 250); font-size: 13.6px; letter-spacing: normal; orphans: 2; widows: 2; word-spacing: 0px;"><span style="background-color: rgb(38, 50, 56); font-size: 15px;"><span style="font-size: 15px; background-color: rgb(38, 50, 56);"><br/></span></span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">不要使用 class，写一个 Person 构造函数</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">function</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Person</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">age</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">;</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">age</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">age</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">;</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Person</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.prototype.</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">sayHi</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">function</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">()</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">console</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.log</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">'</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(195, 232, 141); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">你好，我叫</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">'</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> + </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">);</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">person</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = new Person(</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">'</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(195, 232, 141); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">frank</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">'</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">18</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">person</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> === </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">'</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(195, 232, 141); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">frank</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">'</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(92, 126, 140); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">//</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(76, 174, 76); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> true</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">person</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">age</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> === </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">18</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(92, 126, 140); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">//</span><span style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre; color: rgb(76, 174, 76); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> true</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">person</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.sayHi</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">() </span><span style="font-size: 15px; color: rgb(92, 126, 140); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">//</span><span style="font-size: 15px; color: rgb(76, 174, 76); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> 打印出「你好，我叫 frank」</span></div><div style="background-color: rgb(246, 248, 250); font-size: 13.6px; letter-spacing: normal; orphans: 2; widows: 2; word-spacing: 0px;"><span style="background-color: rgb(38, 50, 56); font-size: 15px;"><span style="font-size: 15px; background-color: rgb(38, 50, 56);"><br/></span></span></div><div style="background-color: rgb(246, 248, 250); font-size: 13.6px; letter-spacing: normal; orphans: 2; widows: 2; word-spacing: 0px;"><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">请用 class 再实现一次上面的功能</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">class</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Person</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">constructor</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">age</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">;</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">age</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">age</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">;</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">sayHi</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">()</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">console</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.log</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">'</span><span style="font-size: 15px; color: rgb(195, 232, 141); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">你好，我叫</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">'</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">+</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 203, 107); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">this</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name</span><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">);</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 255, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">person</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = new Person(</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">'</span><span style="font-size: 15px; color: rgb(195, 232, 141); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">frank</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">'</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">18</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">person</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">name</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> === </span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">'</span><span style="font-size: 15px; color: rgb(195, 232, 141); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">frank</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">'</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(92, 126, 140); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">//</span><span style="font-size: 15px; color: rgb(76, 174, 76); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> true</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">person</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">age</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> === </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">18</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(92, 126, 140); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">//</span><span style="font-size: 15px; color: rgb(76, 174, 76); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> true</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">person</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.sayHi</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">() </span><span style="font-size: 15px; color: rgb(92, 126, 140); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">//</span><span style="font-size: 15px; color: rgb(76, 174, 76); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> 打印出「你好，我叫 frank」</span></div><div><span style="box-sizing: border-box; font-size: 16px; letter-spacing: -0.0444444px; orphans: 2; text-indent: 0px; text-transform: none; white-space: nowrap; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(244, 244, 244); -webkit-box-decoration-break: clone; overflow-wrap: break-word; color: rgb(27, 27, 27); font-family: consolas, &quot;Liberation Mono&quot;, courier, monospace; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">constructor </span><span style="font-size: 16px; letter-spacing: -0.0444444px; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(27, 27, 27); font-family: arial, x-locale-body, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">是一种用于创建和初始化</span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/class" style="box-sizing: border-box; background-color: rgb(244, 244, 244); -webkit-box-decoration-break: clone; white-space: nowrap; overflow-wrap: break-word; font-size: 16px; letter-spacing: -0.0444444px; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(0, 82, 130); font-family: consolas, &quot;Liberation Mono&quot;, courier, monospace; font-variant-caps: normal; font-variant-ligatures: normal; text-decoration: underline;">class</a><span style="font-size: 16px; letter-spacing: -0.0444444px; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(27, 27, 27); font-family: arial, x-locale-body, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">创建的对象的特殊方法。</span></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><span style="font-size: 12pt; font-weight: bold;">使用与运算符判断奇数还是偶数</span></font></div><ul><li><div><span style="font-size: 12pt;">偶数&amp;1 = 0</span></div></li><li><div><span style="font-size: 12pt;">奇数&amp;1 = 1</span></div></li></ul><div><span style="font-size: 12pt;">使用~，&gt;&gt;,&lt;&lt;,&gt;&gt;&gt;,|来取整</span></div><ul><li><div><span style="font-size: 12pt;">console.log(~~ 6.83)  //6 因为</span><span style="font-size: 12pt; color: rgb(229, 0, 255);">位运算符</span><span style="font-size: 12pt;">不支持小数</span></div></li><li><div><span style="font-size: 12pt;">console.log(6.83 &gt;&gt; 0)  //6</span></div></li><li><div><span style="font-size: 12pt;">console.log(6.83 &lt;&lt; 0)  //6</span></div></li><li><div><span style="font-size: 12pt;">console.log(6.83 | 0)  //6</span></div></li><li><div><span style="font-size: 12pt;">console.log(6.83 &gt;&gt;&gt; 0)  //6</span></div></li></ul><div><span style="font-size: 12pt;">使用^来交换a b的值</span></div><ul><li><div><span style="font-size: 12pt;">[a,b] = [b,a]</span></div></li><li><div><span style="font-size: 12pt;">a = a^b</span></div></li></ul><div><span style="font-size: 12pt;">           b = b^a</span></div><div><span style="font-size: 12pt;">           a = a^b</span></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 12pt;">.join（）把数组转为字符串，通过括号中的内容进行分割</span></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">数组排序：</span></span></div><ol><li><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">使用递归</span></div></li></ol><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">sort</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=&gt;</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length &gt; </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">2</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">index</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">minIndex</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">min</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">index</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.splice</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">index</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> [</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">min</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.concat</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">sort</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">))</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    } </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">else</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">] &lt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">] ? </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> : </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.reverse</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">()</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><br/></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">minIndex</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=&gt;</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.indexOf</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">min</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">))</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><br/></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">min</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=&gt;</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length &gt; </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">2</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">min</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">([</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">], </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">min</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.slice</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">))])</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    } </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">else</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Math.</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">min</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.apply</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">null</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(246, 248, 250); font-size: 13.6px; letter-spacing: normal; orphans: 2; widows: 2; word-spacing: 0px;"><span style="background-color: rgb(38, 50, 56); font-size: 15px;"><span style="font-size: 15px; background-color: rgb(38, 50, 56); color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></span></div><div><font style="font-size: 12pt;"><br/></font></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(92, 126, 140); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">//</span><span style="font-size: 15px; color: rgb(76, 174, 76); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> 选择排序最终代码</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><br/></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">sort</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=&gt;</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">for</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> &lt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length - </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">++) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">index</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">minIndex</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.slice</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)) + </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">index</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> !== </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">swap</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">index</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><br/></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">swap</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">array</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=&gt;</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">temp</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">array</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">array</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">] = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">array</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">array</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">] = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">temp</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">minIndex</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=&gt;</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">index</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">for</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> &lt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">++) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">] &lt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">numbers</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">index</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">index</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">index</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><br/></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(92, 126, 140); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">//</span><span style="font-size: 15px; color: rgb(76, 174, 76); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> 快速排序</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><br/></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">quickSort</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=&gt;</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length &lt;= </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">;</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">pivotIndex</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Math.</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">floor(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length / </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">2</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">); //小于或等于指定数字的最大整数</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">pivot</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.splice</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">pivotIndex</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)[</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]; //基准拿出来</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">left</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = [];</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">right</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = [];</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">for</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> &lt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">++) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">] &lt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">pivot</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">left</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.push</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">])</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        } </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">else</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">right</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.push</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">])</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">quickSort</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">left</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.concat</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        [</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">pivot</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">], </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">quickSort</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">right</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">))</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px;"><br/></span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><br/></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(92, 126, 140); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">//</span><span style="font-size: 15px; color: rgb(76, 174, 76); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> 归并排序（一半一半的排）</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">mergeSort</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=&gt;</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">k</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">k</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> === </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">left</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.slice</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Math.</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">floor(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">k</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> / </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">2</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">))</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">right</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.slice</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">Math.</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">floor(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">k</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> / </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">2</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">))</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">merge</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">mergeSort</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">left</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">), </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">mergeSort</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">right</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">))</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">merge</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">a</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">b</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=&gt;</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">a</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length === </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">) </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">b</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">b</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length === </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">) </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">a</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">a</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">] &gt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">b</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">] ? [</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">b</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]]</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.concat</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">merge</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">a</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">b</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.slice</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">))) : [</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">a</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]]</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.concat</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">merge</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">a</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.slice</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">), </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">b</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">))</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><br/></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(92, 126, 140); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">//</span><span style="font-size: 15px; color: rgb(76, 174, 76); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> 计数排序（先找出最大的和最小的，开辟长度为(max-min+1)的空间）</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">countSort</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">=&gt;</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">hashTable</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = {},</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">max</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">,</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">result</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = []</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">for</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> &lt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">++) { </span><span style="font-size: 15px; color: rgb(92, 126, 140); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">//</span><span style="font-size: 15px; color: rgb(76, 174, 76); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> 遍历数组</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (!(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">] in </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">hashTable</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">hashTable</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]] = </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        } </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">else</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">hashTable</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]] += </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">] &gt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">max</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">max</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">for</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> &lt;= </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">max</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">++) { </span><span style="font-size: 15px; color: rgb(92, 126, 140); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">//</span><span style="font-size: 15px; color: rgb(76, 174, 76); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> 遍历哈希表</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> in </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">hashTable</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">for</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> &lt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">hashTable</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">++) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">                </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">result</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.push</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">result</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">如何实现数组去重？</span></span></div><ol><li><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">老方法：</span></div></li></ol><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">for</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> &lt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">array</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length - </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">++) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">item</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">array</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">]</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">for</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> + </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> &lt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">array</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length - </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">++) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">array</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">] === </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">item</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">array</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.splice</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">, </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">j</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">--;</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(246, 248, 250); font-size: 13.6px; letter-spacing: normal; orphans: 2; widows: 2; word-spacing: 0px;"><span style="background-color: rgb(38, 50, 56); font-size: 15px;"><span style="font-size: 15px; background-color: rgb(38, 50, 56); color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">最大的缺点浪费性能，每一个元素都和其他的元素比较了一遍，时间复杂度不友好</span></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><ol start="2"><li><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">使用Set</span></div></li></ol><div><span style="box-sizing: border-box; font-size: 13.6px; overflow-wrap: normal; overflow: visible; border-radius: 3px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; word-break: normal; white-space: pre; border: 0px; color: rgb(36, 41, 46); font-family: SFMono-Regular, Consolas, &quot;Liberation Mono&quot;, Menlo, Courier, monospace; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.45;">let item = [...new Set(array)]</span> <span style="font-size: 14px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(0, 0, 0); font-family: &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">...扩展运算符</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">缺点：ES6毕竟是新出的，所以会考虑兼容问题</span></div><ol start="3"><li><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">使用Map</span></div></li></ol><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">function</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">noRepeat</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(217, 245, 221); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">hashMap</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = new Map()</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">result</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = new Array()</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">for</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">let</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> = </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">0</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> &lt; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.length - </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">1</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">; </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">++) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">if</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> (</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">hashMap</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.has</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">])) {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">hashMap</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.set</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">], </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">false</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        } </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">else</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> {</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">hsahMap</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.set</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">], </span><span style="font-size: 15px; color: rgb(247, 118, 105); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">true</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">)</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">            </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">result</span><span style="font-size: 15px; color: rgb(137, 221, 255); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">.push</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">(</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">arr</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">[</span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">i</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">])</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        }</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">        </span><span style="font-size: 15px; color: rgb(199, 146, 234); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">return</span><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;"> </span><span style="font-size: 15px; color: rgb(255, 83, 112); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">result</span></div><div style="background-color: rgb(38, 50, 56); font-size: 15px; white-space: pre;"><span style="font-size: 15px; color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">    }</span></div><div style="background-color: rgb(246, 248, 250); font-size: 13.6px; letter-spacing: normal; orphans: 2; widows: 2; word-spacing: 0px;"><span style="background-color: rgb(38, 50, 56); font-size: 15px;"><span style="font-size: 15px; background-color: rgb(38, 50, 56); color: rgb(128, 203, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 20px;">}</span></span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">这种方法不但可以做到去重，还可以知道是哪些元素重复了</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">缺点：不能过滤掉重复的Object</span></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 16px;"><span style="font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px;"><span style="font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">创建对象的几种方式：</span></span></div><ol><li><div><span style="font-size: 16px;">new Object()</span></div></li><li><div><span style="font-size: 12pt;">字面式创建：let person = {name:'kaku'}</span></div></li><li><div><span style="font-size: 16px;">工厂模式：上面两种方法在使用同一个接口创建多个对象的时候，会产生大量的重复代码     </span><span style="font-size: 12pt; color: rgb(0, 0, 255); font-family: &quot;Courier New&quot;; line-height: 1.5;">function</span> <span style="font-size: 12pt; color: unset; font-family: &quot;Courier New&quot;; line-height: 1.5;">createPerson(name,age,family) {</span></div></li><div style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px;"><span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 255); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">var</span> <span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">o =</span> <span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 255); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">new</span> <span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">Object();</span></div><div style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px;"><span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">o.name</span> <span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">=</span> <span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">name;</span></div><div style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px;"><span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">o.age</span> <span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">=</span> <span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">age;</span></div><div style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px;"><span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">o.family</span> <span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">=</span> <span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">family;</span></div><div style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px;"><span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">o.say</span> <span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">=</span> <span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 255); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">function</span><span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">(){</span></div><div style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px;"><span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">alert(</span><span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 255); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">this</span><span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">.name);</span></div><div style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px;"><span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">}</span></div><div style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px;"><span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 255); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">return</span> <span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">o;</span></div><div style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px;"><span style="letter-spacing: normal; orphans: 2; white-space: pre-wrap; widows: 2; word-spacing: 0px; font-size: 12pt; color: rgb(0, 0, 0); font-family: &quot;Courier New&quot;; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.5;">}</span></div><li><div><span style="font-size: 12pt;">构造函数模式：function Person(name,age){this.name = name; this.age = age}</span></div></li><li><div><span style="font-size: 16px;">原型模式：function Pers</span><span style="font-size: 16px; color: unset; font-family: unset;">on(){}   Person.prototype.name = 'lu';   Person.prototype.age = 22</span></div></li></ol><div><span style="font-size: 12pt;"><br/></span></div><div><span style="font-size: 12pt;"><br/></span></div><div><span style="font-size: 12pt;"><br/></span></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">new一个对象的时候发生了什么：</span></span></div><ol><li><div><span style="font-size: 16px;">新生成一个对象</span></div></li><li><div><span style="font-size: 16px;">链接到原型obj.__proto__= Object.prototype</span></div></li><li><div><span style="font-size: 16px;">绑定this</span></div></li><li><div><span style="font-size: 16px;">返回新对象</span></div></li></ol><div style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre;"><span style="font-size: 14px; color: rgb(161, 81, 210); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">function</span> <span style="font-size: 14px; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">newGenerater</span><span style="font-size: 14px; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">(</span><span style="font-size: 14px; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">fn</span><span style="font-size: 14px; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">,</span> <span style="font-size: 14px; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">...</span><span style="font-size: 14px; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">args</span><span style="font-size: 14px; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">)</span> <span style="font-size: 14px; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">{</span></div><div style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre;"><span style="font-size: 14px; color: rgb(56, 56, 56); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">    </span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(161, 81, 210); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">const</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">result</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">=</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(161, 81, 210); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">new</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(255, 136, 0); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">Object</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">();</span></div><div style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre;"><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">    result</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">.</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">__proto__</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">=</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">fn</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">.</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">prototype</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">;</span></div><div style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre;"><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(161, 81, 210); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">    const</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">res</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">=</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">fn</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">.</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">call</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">(</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">result</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">,</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">...</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">args</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">);</span></div><div style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre;"><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(161, 81, 210); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">    return</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">(</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(161, 81, 210); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">typeof</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">res</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">===</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(36, 157, 127); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">'object'</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">&amp;&amp;</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">res</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">!==</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(161, 81, 210); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">null</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">)</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">?</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">res</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">:</span> <span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(39, 149, 238); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">result</span><span style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">;</span></div><div style="background-color: rgb(243, 245, 246); font-size: 14px; white-space: pre;"><span style="font-size: 14px; color: rgb(108, 113, 196); font-family: Consolas, &quot;Courier New&quot;, monospace; line-height: 19px;">}</span></div><div><span style="font-size: 16px;"><span style="font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px;"><span style="font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">js中this的指向：</span></span></div><ol style="margin: 0px; padding: 0px 0px 0px 2em; box-sizing: border-box; list-style: lower-alpha; font-size: 16px; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(248, 248, 248);"><li style="margin: 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">fn()</span></div><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">this =&gt; window/global</span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">obj.fn()</span></div><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">this =&gt; obj</span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">fn.call(xx)</span></div><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">this =&gt; xx</span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">fn.apply(xx)</span></div><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">this =&gt; xx</span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">fn.bind(xx)</span></div><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">this =&gt; xx</span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">new Fn()</span></div><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">this =&gt; 新的对象</span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">fn = ()=&gt; {}</span></div><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">this =&gt; 外面的 this</span></div></li></ol><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">HTTP和TCP的关系：</span></span></div><div><span style="font-size: 14px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(255, 0, 0); font-family: &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">TCP是传输层，而http是应用层</span></div><div><span style="font-size: 14px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(51, 51, 51); font-family: &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">http是要基于TCP连接基础上的，简单的说，TCP就是单纯建立连接，不涉及任何我们需要请求的实际数据，简单的传输。http是用来收发数据，即实际应用上来的。</span></div><div><span style="font-size: 14px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(51, 51, 51); font-family: &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">HTTP协议中的数据是利用TCP协议传输的，所以支持HTTP也就一定支持TCP      </span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif, SimHei, SimSun; font-variant-caps: normal; font-variant-ligatures: normal;">HTTP属于</span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; overflow-wrap: break-word; font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif, SimHei, SimSun; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">无状态协议</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif, SimHei, SimSun; font-variant-caps: normal; font-variant-ligatures: normal;">(Stateless)。这表示每一个请求之间是没有相关性的。</span></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><span style="font-size: 12pt; font-weight: bold;">Cookie V.S. LocalStorage V.S. SessionStorage V.S. Session</span></font></div><ul style="margin: 0px; padding: 0px 0px 0px 2em; box-sizing: border-box; list-style: disc;"><li style="margin: 0px; padding: 0px; box-sizing: border-box;"><div>Cookie V.S. LocalStorage</div></li><ol style="margin: 0px; padding: 0px 0px 0px 2em; box-sizing: border-box; list-style: lower-alpha;"><li style="margin: 0px; padding: 0px; box-sizing: border-box;"><div>主要区别是 Cookie 会被发送到服务器，而 LocalStorage 不会</div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div>Cookie 一般最大 4k，LocalStorage 可以用 5Mb 甚至 10Mb（各浏览器不同）</div></li></ol><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div>LocalStorage V.S. SessionStorage</div></li><ol style="margin: 0px; padding: 0px 0px 0px 2em; box-sizing: border-box; list-style: lower-alpha;"><li style="margin: 0px; padding: 0px; box-sizing: border-box;"><div>LocalStorage 一般不会自动过期（除非用户手动清除），而 SessionStorage 在回话结束时过期（如关闭浏览器）</div></li></ol><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div>Cookie V.S. Session</div></li><ol style="margin: 0px; padding: 0px 0px 0px 2em; box-sizing: border-box; list-style: lower-alpha;"><li style="margin: 0px; padding: 0px; box-sizing: border-box;"><div>Cookie 存在浏览器的文件里，Session 存在服务器的文件里</div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div>Session 是基于 Cookie 实现的，具体做法就是把 SessionID 存在 Cookie 里</div></li></ol></ul><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">DocType的作用：</span></span></div><div><span style="font-size: 16px;">声明位于文档最前面，告诉浏览器应该用什么样的方式来渲染页面</span></div><div><span style="font-size: 16px;">严格模式（标准模式）：以浏览器支持的最高标准执行，</span> <span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(64, 64, 64); font-family: -apple-system, BlinkMacSystemFont, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Segoe UI&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;"> </span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(64, 64, 64); font-family: -apple-system, BlinkMacSystemFont, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Segoe UI&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">HTML5 不基于 S GML，因此不需要对DTD进行引用，但是需要doctype来规范浏览器的行为</span></div><div><span style="font-size: 16px;">混杂模式：向后兼容，防止浏览器无法兼容页面</span></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">数据库的事务概念以及特性：</span></span></div><div><span style="box-sizing: border-box; outline: 0px; font-size: 14px; background-color: rgb(249, 242, 244); border-radius: 2px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(199, 37, 78); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 22px;">事务</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">，简短的说就是一组操作要么全部完成，要么全部不做，绝不允许只做其中的一部分操作。</span></div><ul><li><div><span style="font-size: 16px;">原子性</span></div></li><li><div><span style="font-size: 16px;">一致性</span></div></li><li><div><span style="font-size: 16px;">隔离性：</span><span style="font-size: 16px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-ligatures: no-common-ligatures;">并发 【对于任意两个并发的事务A和B，在事务A看来，B要么在A开始之前就已经结束，要么在A结束之后才开始，这样每个事务都感觉不到有其他事务在并发地执行。】</span></div></li><li><div><span style="font-size: 16px;"><span style="font-size: 16px; color: rgb(77, 77, 77); font-family: unset;">持久性：</span></span><span style="font-size: 16px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-ligatures: no-common-ligatures;">对数据库中的数据的改变就是永久性的</span></div></li></ul><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">Position有哪些取值：</span></span></div><ol><li><div><span style="font-size: 16px;">relative：</span> <span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">但其在文本流中的位置依然存在。</span></div></li><li><div><span style="font-size: 12pt;"><span style="font-size: 12pt; font-weight: bold;">absolute：</span></span> 脱离文档流<span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">，但与relative的区别是其在正常流中的位置不再存在。</span> <span style="font-size: 16px; letter-spacing: -0.0444444px; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(27, 27, 27); font-family: arial, x-locale-body, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">绝对定位的元素可以设置外边距（margins），且不会与其他边距合并。</span></div></li><li><div><span style="font-size: 12pt;">static(默认值)</span></div></li><li><div><span style="font-size: 12pt;"><span style="font-size: 12pt; font-weight: bold;">fixed：</span></span> <span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">相对于浏览器窗口进行定位。</span></div></li><li><div><span style="font-size: 16px;">sticky：粘滞定位，兼容很差</span></div></li></ol><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><span style="font-size: 12pt; font-weight: bold;">vm = new Vue({data:myData})做了哪些事情</span></font></div><ol><li><div><span style="font-size: 16px;">会让vm称为myData的代理（proxy）</span></div></li><li><div><span style="font-size: 16px;">会对myData的所有属性进行监控</span></div></li><li><div><span style="font-size: 16px;">监控就是为了防止myData的属性变了，vm不知道</span></div></li><li><div><span style="font-size: 16px;">vm知道了之后就可以调用render(data）UI=render(data）</span></div></li></ol><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 14.6667px; font-weight: bold;">vue双向绑定是怎么实现的：</span></div><div><span style="font-size: 15.2px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">vue实现数据双向绑定主要是：采</span><span style="font-size: 15.2px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">用数据劫持结合发布者-订阅者模式</span><span style="font-size: 15.2px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">的方式，通过 </span><span style="font-size: 12px; display: inline-block; overflow-x: auto; vertical-align: middle; border-radius: 3px; background-color: rgb(246, 246, 246); letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(232, 62, 140); font-family: &quot;Courier New&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.8;">Object.defineProperty()</span><span style="font-size: 15.2px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;"> 数据劫持，来劫持各个属性的setter，getter，在数据更新时发布消息给订阅者，触发相应监听回调。</span></div><div><br/></div><div><span style="font-size: 12pt; font-weight: bold;">computed和watch有什么区别：</span></div><div><span style="font-size: 12pt;">computed就是计算属性的意思，watch就是监听的意思</span></div><div><span style="font-size: 12pt;">computed是用来计算出一个值的，这个值在调用的时候不需要加括号，可以当属性一样直接使用，它会根据依赖自动缓存，依赖不改变的时候值不会重新计算</span></div><div><span style="font-size: 16px;">watch有两个选项，一个是immediate，表示是否在第一次渲染的时候执行这个函数，还有一个值是deep，比如说要监听一个对象的变化，是否要看这个对象里面的变化，在方法中会有两个参数，分别是newvVal和oldVal</span></div><div><br/></div><div><br/></div><div><span style="font-size: 14pt;"><span style="font-size: 14pt; color: rgb(229, 0, 255); font-weight: bold;">Vue的响应式原理：</span></span></div><ul><li><div>options.data会被Vue监听</div></li><li><div>会被Vue实例代理</div></li><li><div>每次对data属性的读写都会被Vue监控</div></li><li><div>Vue会在data变化时更新UI</div></li></ul><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">创建Vue实例时，将data中所有property遍历，通过</span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; overflow-wrap: break-word; font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; font-weight: bold;">Object.defineProperty把属性全部转为</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">getter、setter，通过</span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; overflow-wrap: break-word; font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; font-weight: bold;">观察者模式</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">（watcher），在调用setter时（修改数据时），通知依赖更新，但是Vue不能检测到对象属性的添加或者删除，这个时候要使用Vue.set和Vue.$set可以搞定</span></div><ol style="padding-left: 1.2em; font-size: 16px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255);"><li><div><span style="font-size: 16px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 1.7;">当一个值被读取时进行追踪</span><span style="font-size: 16px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">，</span> <span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">proxy 的</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;"> </span><span style="font-size: 0.85em; background-color: rgba(27, 31, 35, 0.05); border-radius: 3px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(71, 101, 130); font-family: source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">get</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;"> </span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">处理函数中</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;"> </span><span style="font-size: 0.85em; background-color: rgba(27, 31, 35, 0.05); border-radius: 3px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(71, 101, 130); font-family: source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">track</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;"> </span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">函数记录了该 property 和当前副作用。</span></div></li><li><div><span style="font-size: 16px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 1.7;">当某个值改变时进行检测</span><span style="font-size: 16px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">，</span> <span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">在 proxy 上调用</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;"> </span><span style="font-size: 0.85em; background-color: rgba(27, 31, 35, 0.05); border-radius: 3px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(71, 101, 130); font-family: source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">set</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;"> </span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">处理函数</span></div></li><li><div><span style="font-size: 16px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 1.7;">重新运行代码来读取原始值</span><span style="font-size: 16px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">， </span> <span style="font-size: 0.85em; background-color: rgba(27, 31, 35, 0.05); border-radius: 3px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(71, 101, 130); font-family: source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">trigger</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;"> </span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.7;">函数查找哪些副作用依赖于该 property 并执行它们。</span></div></li><li><div><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 14px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(249, 242, 244); border-radius: 2px; color: rgb(199, 37, 78); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 22px;">target:</span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 16px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 26px;">要使用</span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 16px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 26px;"> </span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 14px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(249, 242, 244); border-radius: 2px; color: rgb(199, 37, 78); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 22px;">Proxy</span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 16px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 26px;"> </span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 16px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 26px;">包装的目标对象（可以是任何类型的对象，包括原生数组，函数，甚至另一个代理）。</span></div></li><li><div style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; margin: 0px 0px 16px; padding: 0px; font-size: 16px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255);"><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 14px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(249, 242, 244); border-radius: 2px; color: rgb(199, 37, 78); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 22px;">handler:</span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 16px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 26px;">一个通常以函数作为属性的对象，各属性中的函数分别定义了在执行各种操作时代理</span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 16px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 26px;"> </span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 14px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(249, 242, 244); border-radius: 2px; color: rgb(199, 37, 78); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 22px;">p</span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 16px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 26px;"> </span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 16px; overflow-wrap: break-word; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; line-height: 26px;">的行为。</span></div></li></ol><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">我们使用了Proxy ，</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">Proxy</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(44, 62, 80); font-family: Inter, Roboto, Oxygen, &quot;Fira Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">是一个对象，它包装了另一个对象，并允许你拦截对该对象的任何交互。</span></div><div><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 14px; overflow-wrap: normal; word-break: break-all; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: pre; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(0, 119, 170); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-stretch: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-variant-numeric: normal; line-height: normal;">const</span> <span style="font-size: 14px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: pre; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(250, 250, 250); color: rgb(0, 0, 0); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">p</span> <span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 14px; overflow-wrap: normal; word-break: break-all; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: pre; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(166, 127, 89); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-stretch: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-variant-numeric: normal; line-height: normal;">=</span> <span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 14px; overflow-wrap: normal; word-break: break-all; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: pre; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(0, 119, 170); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-stretch: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-variant-numeric: normal; line-height: normal;">new</span> <span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 14px; overflow-wrap: normal; word-break: break-all; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: pre; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(0, 0, 0); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-stretch: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-variant-numeric: normal; line-height: normal;">Proxy</span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 14px; overflow-wrap: normal; word-break: break-all; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: pre; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(153, 153, 153); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-stretch: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-variant-numeric: normal; line-height: normal;">(</span><span style="font-size: 14px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: pre; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(250, 250, 250); color: rgb(0, 0, 0); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">target</span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 14px; overflow-wrap: normal; word-break: break-all; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: pre; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(153, 153, 153); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-stretch: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-variant-numeric: normal; line-height: normal;">,</span> <span style="font-size: 14px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: pre; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(250, 250, 250); color: rgb(0, 0, 0); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">handler</span><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; font-size: 14px; overflow-wrap: normal; word-break: break-all; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: pre; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(153, 153, 153); font-family: &quot;Source Code Pro&quot;, &quot;DejaVu Sans Mono&quot;, &quot;Ubuntu Mono&quot;, &quot;Anonymous Pro&quot;, &quot;Droid Sans Mono&quot;, Menlo, Monaco, Consolas, Inconsolata, Courier, monospace, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, sans-serif; font-stretch: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-variant-numeric: normal; line-height: normal;">)</span></div><div><br/></div><div><font style="font-size: 12pt;"><b>v-show和v-if的区别：</b></font></div><ul><li><div>v-if是真正的条件渲染，切换过程中条件块内的事件监听和子组件适当的被销毁和重建</div></li><li><div>v-if是惰性的，初始条件为假时什么也不做，直到第一次变为真的时候才会开始渲染条件块</div></li><li><div>v-show使用的是display，总是被渲染，只是是否被显示的问题</div></li><li><div>v-if有切换开销，v-show有渲染开销</div></li></ul><div><br/></div><div><font style="font-size: 14pt;"><span style="font-size: 14pt; color: rgb(235, 0, 115); font-weight: bold;">VueRouter 你怎么用的？</span></font></div><ol style="margin: 0px 0px 16px; padding: 0px 0px 0px 2em; box-sizing: border-box; list-style: decimal; font-size: 16px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><ol style="margin: 0px; padding: 0px 0px 0px 2em; box-sizing: border-box; list-style: lower-roman;"><li style="margin: 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">背下文档第一句：Vue Router 是 Vue.js 官方的路由管理器。</span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">说出核心概念的名字和作用：History 模式/导航守卫/路由懒加载</span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">说出常用 API：router-link/router-view/this.$router.push/this.$router.replace/this.$route.params</span></div><div style="margin: 0px 0px 16px; padding: 16px; box-sizing: border-box; font-size: 13.6px; overflow-wrap: normal; overflow: auto; background-color: rgb(246, 248, 250); border-radius: 3px;"><div><span style="box-sizing: border-box; font-size: 13.6px; background: transparent; border-radius: 3px; word-break: normal; white-space: pre; border: 0px; overflow: visible; overflow-wrap: normal; color: rgb(36, 41, 46); font-family: SFMono-Regular, Consolas, &quot;Liberation Mono&quot;, Menlo, Courier, monospace; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.45;">this.$router.push('/user-admin')</span></div><div><span style="box-sizing: border-box; font-size: 13.6px; background: transparent; border-radius: 3px; word-break: normal; white-space: pre; border: 0px; overflow: visible; overflow-wrap: normal; color: rgb(36, 41, 46); font-family: SFMono-Regular, Consolas, &quot;Liberation Mono&quot;, Menlo, Courier, monospace; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 1.45;">this.$route.params</span></div></div></li></ol></ol><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(248, 248, 248);"><span style="background-color: rgb(248, 248, 248); font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(248, 248, 248);"><span style="background-color: rgb(248, 248, 248); font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(248, 248, 248);"><span style="background-color: rgb(248, 248, 248); font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(248, 248, 248);"><span style="background-color: rgb(248, 248, 248); font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(248, 248, 248);"><span style="background-color: rgb(248, 248, 248); font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">路由守卫(导航守卫)是什么？</span></span></div><div><span style="font-size: medium; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(18, 18, 18); font-family: -apple-system, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Source Han Sans SC&quot;, &quot;Noto Sans CJK SC&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">路由跳转是一个大的过程，这个大的过程分为跳转前中后等等细小的过程，在每一个过程中都有一函数，这个函数能让你操作一些其他的事儿的时机，这就是导航守卫。</span></div><ul><li><div><span style="color: rgb(18, 18, 18);">全局前置守卫</span></div></li><li><div><span style="color: rgb(18, 18, 18);">全局解析守卫</span></div></li><li><div><span style="color: rgb(18, 18, 18);">全局后置钩子</span></div></li><li><div><span style="color: rgb(18, 18, 18);">路由独享守卫</span></div></li><li><div><span style="color: rgb(18, 18, 18);">组件内的守卫</span></div></li></ul><div><br/></div><div><br/></div><div><br/></div><div><br/></div><div><font style="font-size: 12pt;"><span style="font-size: 12pt; font-weight: bold;">路由懒加载怎么做：</span></font></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(44, 62, 80); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Fira Sans&quot;, &quot;Droid Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件</span></div><div><span style="font-size: 12pt;">import('./Foo.vue') //返回Promise</span></div><div><br/></div><div><br/></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(248, 248, 248);"><span style="background-color: rgb(248, 248, 248); font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">watch 和 computed 和 methods 区别是什么？</span></span></div><ol style="margin: 0px; padding: 0px 0px 0px 2em; box-sizing: border-box; list-style: lower-alpha; font-size: 16px; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(248, 248, 248);"><li style="margin: 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">computed 和 methods 相比，最大区别是 computed 有缓存：如果 computed 属性依赖的属性没有变化，那么 computed 属性就不会重新计算。methods 则是看到一次计算一次。</span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">watch 和 computed 相比，computed 是计算出一个属性（废话），而 watch 则可能是做别的事情（如上报数据）。</span></div></li></ol><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">声明周期钩子：</span></span></div><ol style="margin: 0px; padding: 0px 0px 0px 2em; box-sizing: border-box; list-style: lower-roman; font-size: 16px; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(248, 248, 248);"><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">要特别说明哪个钩子里请求数据，</span><a href="https://segmentfault.com/q/1010000010643393" style="box-sizing: border-box; font-size: 16px; color: rgb(3, 102, 214); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;" title="null">答案是 mounted</a></div></li></ol><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(248, 248, 248);"><span style="background-color: rgb(248, 248, 248); font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">Vue 如何实现组件间通信？</span></span></div><ol style="margin: 0px; padding: 0px 0px 0px 2em; box-sizing: border-box; list-style: lower-roman; font-size: 16px; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(248, 248, 248);"><li style="margin: 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">父子组件：$emit('xxx',data)  $on('xxx',function(){})</span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">爷孙组件：使用两次 v-on 通过爷爷爸爸通信，爸爸儿子通信实现爷孙通信</span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">任意组件：使用 eventBus = new Vue() 来通信，eventBus.$on 和 eventBus.$emit 是主要API</span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">任意组件：使用 Vuex 通信</span></div></li></ol><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 12pt; font-weight: bold;">Vuex 你怎么用的？</span></div><ol style="margin: 0px 0px 16px; padding: 0px 0px 0px 2em; box-sizing: border-box; list-style: decimal; font-size: 16px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><ol style="margin: 0px; padding: 0px 0px 0px 2em; box-sizing: border-box; list-style: lower-roman;"><li style="margin: 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">背下文档第一句：Vuex 是一个专为 Vue.js 应用程序开发的</span><span style="font-size: 16px;"><span style="font-size: 16px; color: rgb(186, 0, 255); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">状态管理工具</span></span></div></li><li style="margin: 0.25em 0px 0px; padding: 0px; box-sizing: border-box;"><div><span style="font-size: 16px; color: rgb(36, 41, 46); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">说出核心概念的名字和作用：State/Getter/Mutation/Action/Module</span></div></li></ol></ol><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">state =&gt; 基本数据</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">getters =&gt; 从基本数据派生的数据</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">mutations =&gt; 提交更改数据的方法，同步！</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">actions =&gt; 像一个装饰器，包裹mutations，使之可以异步。</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures;">modules =&gt; 模块化Vuex</span></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(44, 62, 80); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Fira Sans&quot;, &quot;Droid Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">这种模式充分利用</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(44, 62, 80); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Fira Sans&quot;, &quot;Droid Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;"> </span><span style="font-size: 0.85em; background-color: rgba(27, 31, 35, 0.05); border-radius: 3px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(71, 101, 130); font-family: source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; font-variant-caps: normal; font-variant-ligatures: normal;">history.pushState</span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(44, 62, 80); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Fira Sans&quot;, &quot;Droid Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;"> </span><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(44, 62, 80); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, Cantarell, &quot;Fira Sans&quot;, &quot;Droid Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">API 来完成 URL 跳转而无须重新加载页面。</span></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">CSS语义化命名：</span></span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">header 头部/页眉；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">logo 标志；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">nav/sub_nav 导航/子导航；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">banner 横幅广告；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">main/content 主体/内容；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">container/con 容器；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">wrapper/wrap 包裹（类似于container）；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">menu 菜单；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">sub_menu/second_menu 子菜单/二级菜单；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">list 列表；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">section 分区/分块（类似于div）;</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">article 文章；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">aside 侧边栏/广告；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">footer 页脚/底部；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">title/sub_title 标题/副标题；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">news 新闻；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">hot 热点；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">pro 产品（product）；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">company 公司；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">msg/info 信息（message）/消息；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">ads 广告（advertisements）;</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">icon 小图标；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">copyright 版权；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">contact_us 联系我们；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">friend_link 友情链接；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">tel 联系电话（telephone）；</span></div><div><span style="font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(33, 37, 41); font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, &quot;Helvetica Neue&quot;, Arial, &quot;Noto Sans&quot;, &quot;Liberation Sans&quot;, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; font-variant-caps: normal; font-variant-ligatures: normal;">address 地址；</span></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 12pt; font-weight: bold;">首先介绍一下HTTP</span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;">HTTP 协议，全称Hyper Text Transfer Protocol，超文本传输协议，它是一种规范，完成从客户端到服务器端等一系列运作流程。</span></div><div><br/></div><div><br/></div><div><span style="box-sizing: border-box; outline: 0px; --tw-shadow: 0 0 #0000; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(66, 153, 225, 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; overflow-wrap: break-word; font-size: 16px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(77, 77, 77); font-family: -apple-system, &quot;SF UI Text&quot;, Arial, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: no-common-ligatures; font-weight: bold;">HTTP不同版本特点</span></div><ul><li><div><span style="font-size: 12pt; font-family: &quot;PingFang SC&quot;;">0.9：请求方式只支持GET请求</span></div></li><li><div><span style="font-size: 12pt; font-family: &quot;PingFang SC&quot;;">1.0：请求方式增加了post，put，options等，增加了状态码，用来明确错误类型</span></div></li><li><div><span style="font-size: 12pt; font-family: &quot;PingFang SC&quot;;">1.1：头信息是二进制，数据可以是二进制也可以是文本，增加了持久链接和管道机制</span></div></li><li><div><span style="font-size: 12pt; font-family: &quot;PingFang SC&quot;;">2.0：二进制传输，多路复用，</span><span style="font-size: 16px; background-color: rgb(255, 255, 255); color: rgb(51, 51, 51); font-family: -apple-system, system-ui, &quot;Segoe UI&quot;, Roboto, Ubuntu, Cantarell, &quot;Noto Sans&quot;, sans-serif, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, Arial;">头部压缩</span></div></li></ul><div><span style="font-size: 16px;"><span style="font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px;"><span style="font-size: 16px;"><br/></span></span></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">请求的几种方式：</span></span></div><ul style="padding: 0px; margin: 1.4em 0px; display: table; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255);"><li style="list-style: none; display: table-row;"><div><span style="font-size: 12pt; color: rgb(18, 18, 18); font-family: -apple-system, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Source Han Sans SC&quot;, &quot;Noto Sans CJK SC&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">OPTIONS 返回服务器所支持的请求方法</span></div></li><li style="list-style: none; display: table-row;"><div><span style="font-size: 12pt; color: rgb(18, 18, 18); font-family: -apple-system, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Source Han Sans SC&quot;, &quot;Noto Sans CJK SC&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">GET 向服务器获取指定资源</span></div></li><li style="list-style: none; display: table-row;"><div><span style="font-size: 12pt; color: rgb(18, 18, 18); font-family: -apple-system, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Source Han Sans SC&quot;, &quot;Noto Sans CJK SC&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">HEAD 与GET一致，只不过响应体不返回，只返回响应头</span></div></li><li style="list-style: none; display: table-row;"><div><span style="font-size: 12pt; color: rgb(18, 18, 18); font-family: -apple-system, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Source Han Sans SC&quot;, &quot;Noto Sans CJK SC&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">POST 向服务器提交数据，数据放在请求体里</span></div></li><li style="list-style: none; display: table-row;"><div><span style="font-size: 12pt; color: rgb(18, 18, 18); font-family: -apple-system, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Source Han Sans SC&quot;, &quot;Noto Sans CJK SC&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">PUT 与POST相似，只是具有幂等特性，一般用于更新</span></div></li><li style="list-style: none; display: table-row;"><div><span style="font-size: 12pt; color: rgb(18, 18, 18); font-family: -apple-system, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Source Han Sans SC&quot;, &quot;Noto Sans CJK SC&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">DELETE 删除服务器指定资源</span></div></li><li style="list-style: none; display: table-row;"><div><span style="font-size: 12pt; color: rgb(18, 18, 18); font-family: -apple-system, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Source Han Sans SC&quot;, &quot;Noto Sans CJK SC&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">TRACE 回显服务器端收到的请求，测试的时候会用到这个</span></div></li><li style="list-style: none; display: table-row;"><div><span style="font-size: 12pt; color: rgb(18, 18, 18); font-family: -apple-system, BlinkMacSystemFont, &quot;Helvetica Neue&quot;, &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Source Han Sans SC&quot;, &quot;Noto Sans CJK SC&quot;, &quot;WenQuanYi Micro Hei&quot;, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">CONNECT 预留，暂无使用</span></div></li></ul><div><br/></div><h4><font style="font-size: 12pt;"><span style="font-size: 12pt; font-weight: bold;">POST 请求的过程：</span></font></h4><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt;">浏览器请求TCP连接（第一次握手）</span></span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt;">服务器答应进行 TCP 连接（第二次握手）</span></span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt;">浏览器确认，并发送 POST 请求头（第三次握手，这个报文比较小，所以 HTTP 会在此时进行第一次数据发送）</span></span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt;">服务器返回100 Continue响应</span></span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt;">浏览器发送数据</span></span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt;">服务器返回 200 OK响应</span></span></div><div style="margin-top: 1em; margin-bottom: 1em;"></div><h4><font style="font-size: 12pt;"><span style="font-size: 12pt; font-weight: bold;">GET 请求的过程：</span></font></h4><h4><span style="font-size: 12pt;">浏览器请求 TCP 连接（第一次握手）</span></h4><h4><span style="font-size: 12pt;">服务器答应进行 TCP 连接（第二次握手）</span></h4><h4><span style="font-size: 12pt;">浏览器确认，并发送 GET 请求头和数据（第三次握手，这个报文比较小，所以 HTTP 会在此时进行第一次数据发送）</span></h4><div><span style="font-size: 12pt;">服务器返回 200 OK响应</span></div><div><br/></div><div><br/></div><div><br/></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">get和POST的区别：</span></span></div><ol><li><div><span style="font-size: 16px;">本质上一样，只是http为了不同的分工而规定的两种请求方式，http的底层是TCP/IP，所以get和post的底层也是</span><span style="font-size: 16px;">TCP/IP</span></div></li></ol><ol start="2"><li><div><span style="font-size: 16px;"><span style="font-size: 16px; color: rgb(93, 218, 255);">作用不同：</span>get多用于从服务器获取资源，post一般向服务端提交资源</span></div></li><li><div><span style="font-size: 16px; color: rgb(93, 218, 255); font-family: unset;">参数传递方式不同：</span><span style="font-size: 16px; color: unset; font-family: unset;">get提交的数据在地址栏中可以看见，post提交的数据可以在开发者工具中看到，放到了叫做from data中</span></div></li><li><div><span style="font-size: 16px; color: rgb(93, 218, 255); font-family: unset;">安全性不同：</span><span style="font-size: 16px; color: unset; font-family: unset;">get和post更不安全，它直接暴露在url上，从传输的角度来说，都不安全，因为http在网络上是明文传输的，只要抓包都能获取完整信息，想要安全只能加密传输也就是使用HTTPS</span></div></li><li><div><span style="font-size: 16px;"><span style="font-size: 16px; color: rgb(93, 218, 255); font-family: unset;">长度限制不同：</span></span><span style="font-size: 16px; color: unset; font-family: unset;">get请求，http规范对url的长度没有限制，只是不同的浏览器对它做了限制（一般上url长度不要超过2kb就好）</span><span style="font-size: 16px; color: unset; font-family: unset;">post请求也没有长度限制，限制它的是服务器的处理能力与存储大小，还有就是web容器的限制，比如Tomcat默认2M</span></div></li><li><div><span style="font-size: 12pt;"><span style="font-size: 12pt; color: rgb(93, 218, 255);">参数数据类型不同</span>：</span><span style="font-size: 12pt; color: unset; font-family: unset;">get只接受ASCII字符，post支持更多的编码类型</span></div></li><li><div><span style="font-size: 16px;"><span style="font-size: 16px; color: rgb(93, 218, 255);">缓存机制不同：</span></span><span style="font-size: 12pt;">GET 请求会被浏览器主动cache，而 POST 不会，除非手动设置。</span><span style="font-size: 12pt; color: unset; font-family: unset;">GET 请求参数会被完整保留在浏览器历史记录里，而 POST 中的参数不会被保留。</span><span style="font-size: 12pt; color: unset; font-family: unset;">GET 在浏览器回退时是无害的，而 POST 会再次提交请求。</span></div></li><li><div><span style="font-size: 16px;"><span style="font-size: 16px; color: rgb(93, 218, 255);">时间消耗不同</span>：get产生一个tcp数据包，post会产生两个数据包</span></div></li></ol><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 16px; font-weight: bold;">浏览器输入url后，发生了什么：</span></div><ol><li><div><span style="font-size: 16px;">解析url</span></div></li><li><div><span style="font-size: 12pt; font-family: &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif;">DNS解析</span></div></li><li><div><span style="font-size: 12pt; font-family: &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif;">浏览器与网站建立TCP连接（三次握手）</span></div></li><li><div><span style="font-size: 16px; font-family: &quot;PingFang SC&quot;;">请求和传输数据</span></div></li><li><div><span style="font-size: 16px; font-family: &quot;PingFang SC&quot;;">浏览器渲染页面</span></div></li></ol><ul><li><div><span style="font-size: 14px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(0, 0, 0); font-family: &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">浏览器会解析html源码，然后创建一个 DOM树。</span></div></li><li><div><span style="font-size: 14px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(0, 0, 0); font-family: &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">浏览器解析CSS代码，计算出最终的样式数据，形成css对象模型CSSOM。</span></div></li><li><div><span style="font-size: 14px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(0, 0, 0); font-family: &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">利用DOM和CSSOM构建一个渲染树（rendering tree）。</span></div></li><li><div><span style="font-size: 14px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(0, 0, 0); font-family: &quot;PingFang SC&quot;, &quot;Microsoft YaHei&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-variant-caps: normal; font-variant-ligatures: normal;">浏览器就根据渲染树直接把页面绘制到屏幕上。</span></div></li></ul><div><br/></div><div><span style="font-size: 12pt; font-weight: bold;">http的报文格式：</span></div><div><img src="面试_files/Image.png" type="image/png" data-filename="Image.png"/></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;">首部内容由以下数据组成：</span></div><ul><li><div>请求行：请求方法、请求URI、HTTP版本</div></li><li><div>状态行：标明响应结果的的状态码，原因短语和HTTP版本。</div></li><li><div>首部字段：一般是通用首部、请求首部、响应首部和实体首部。</div></li><li><div>其他</div></li></ul><div><br/></div><div><br/></div><ol><li><div><span style="font-weight: bold;">报文首部</span></div></li></ol><hr/><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;">首部：在客户端和服务器处理时起重要作用的信息几乎都在这边</span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;">主体：所需要的用户和资源的信息都在这边</span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;">1.1</span> <span style="font-weight: bold;-en-paragraph:true;">HTTP请求报文</span></div><ul><li><div>请求行：方法、URI、HTTP版本</div></li><li><div>请求头：首部字段（请求首部字段、通用首部字段、实体首部字段）</div></li><li><div>请求体：发送的数据</div></li></ul><div style="margin-top: 1em; margin-bottom: 1em;"><span style="font-weight: bold;-en-paragraph:true;">1.2 HTTP响应报文</span></div><ul><li><div>响应行：HTTP版本号、状态码、原因短语</div></li><li><div>响应头：响应首部字段、通用首部字段、实体首部字段</div></li><li><div>响应体：响应的数据</div></li></ul><div><br/></div><div><br/></div><div><span style="font-size: 12pt; color: unset; font-family: unset; font-weight: bold;"> 报文主体和实体主体的差异</span></div><ul><li><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;">报文</span></div><div>是HTTP通信中的基本单位，由8位组字节流组成，通过HTTP通信传输。</div></li><li><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;">实体</span></div><div>作为请求或相应的有效何在数据（补充项）被传输，其内容由实体首部和实体主体组成。</div></li></ul><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><span style="font-size: 16px;"><span style="font-size: 16px; font-weight: bold;">协议层数：</span></span></div><div><img src="面试_files/20170822222325781.png" type="image/png" data-filename="20170822222325781.png"/></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><font style="font-size: 12pt;"><br/></font></div><div><br/></div></div><div><br/></div></span>
</div></body></html> 